import React, {Component} from 'react';
import {connect} from 'react-redux';
import Proptypes from 'prop-types';
import {updateInfoAsync} from './../redux/actions';

import Avatarlist from "./Avatarlist";
import {List, InputItem, Button, Picker, Toast} from "antd-mobile";
const rongziZone = [
    {label:'未融资', value:'未融资'}, {label:'不需要融资', value:'不需要融资'},
    {label:'A轮', value:'A轮'}, {label:'B轮', value:'B轮'}, {label:'C轮', value:'C轮'},
    {label:'D轮以上', value:'D轮以上'}, {label:'已上市', value:'已上市'}
]
const guimoZone = [
    {label:'0-20人', value:'0-20人'}, {label:'20-99人', value:'20-99人'},
    {label:'100-499人', value:'100-499人'}, {label:'500-999人', value:'500-999人'},
    {label:'1000人以上', value:'1000人以上'}
]
const province = [
    {
        label: '福建',
        value: '福建',
        children: [
            {
                label: '福州',
                value: '福州',
            },
            {
                label: '厦门',
                value: '厦门',
                children: [
                    {
                        label: '同安区',
                        value: '同安区',
                    },
                    {
                        label: '思明区',
                        value: '思明区',
                    },
                    {
                        label: '湖里区',
                        value: '湖里区',
                    },
                    {
                        label: '集美区',
                        value: '集美区',
                    },
                    {
                        label: '翔安区',
                        value: '翔安区',
                    },
                    {
                        label: '海沧区',
                        value: '海沧区',
                    },
                ]
            },
            {
                label: '莆田',
                value: '莆田',
            },
            {
                label: '泉州',
                value: '泉州',
            },
        ],
    },
    {
        label: '北京',
        value: '北京',
        children: [
            {
                label: '东城区',
                value: '东城区',
            },
            {
                label: '西城区',
                value: '西城区',
            },
            {
                label: '崇文区',
                value: '崇文区',
            },
            {
                label: '宣武区',
                value: '宣武区',
            },
        ],
    },
    {
        label: '浙江',
        value: '浙江',
        children: [
            {
                label: '杭州',
                value: '杭州',
                children: [
                    {
                        label: '西湖区',
                        value: '西湖区',
                    },
                    {
                        label: '上城区',
                        value: '上城区',
                    },
                    {
                        label: '江干区',
                        value: '江干区',
                    },
                    {
                        label: '下城区',
                        value: '下城区',
                    },
                ],
            },
            {
                label: '宁波',
                value: '宁波',
                children: [
                    {
                        label: 'xx区',
                        value: 'xx区',
                    },
                    {
                        label: 'yy区',
                        value: 'yy区',
                    },
                ],
            },
            {
                label: '温州',
                value: '温州',
            },
            {
                label: '嘉兴',
                value: '嘉兴',
            },
            {
                label: '湖州',
                value: '湖州',
            },
            {
                label: '绍兴',
                value: '绍兴',
            },
        ],
    },
];

class Bossinfo extends Component {

    static propTypes = {
        user:Proptypes.object.isRequired,
        updateInfo:Proptypes.func.isRequired
    }

    state = {
        avatar:this.props.user.avatar || '',
        nickname:this.props.user.nickname || '',
        company:this.props.user.company || '',
        bossJob:this.props.user.bossJob || '',
        rongzi:(this.props.user.rongzi && this.props.user.rongzi.split()) || ['未融资'],
        guimo:(this.props.user.guimo && this.props.user.guimo.split()) || ['0-20人'],
        companyAddr:(this.props.user.companyAddr && this.props.user.companyAddr.split(' ')) || []
    }

    handleChange = (type, data) => {
        switch (type) {
            case 'avatar':this.setState({avatar:data});break;
            case 'nickname':this.setState({nickname:data});break;
            case 'company':this.setState({company:data});break;
            case 'rongzi':this.setState({rongzi:data});break;
            case 'guimo':this.setState({guimo:data});break;
            case 'job':this.setState({bossJob:data});break;
            case 'addr':this.setState({companyAddr:data});break;
            default: break;
        }
    }
    handleSave = () => {
        let flag = Object.keys(this.state).some(k=>this.state[k]=='')
        if(flag){
            Toast.fail('请完善全部信息',1)
        }else{
            let {history, user} = this.props;
            let companyAddr = this.state.companyAddr.join(' ');
            let rongzi = this.state.rongzi.join();
            let guimo = this.state.guimo.join();
            let userData = {...user, ...this.state, companyAddr, rongzi, guimo};
            this.props.updateInfo(userData, (code, msg)=>{
                if(code === 0){
                    Toast.success('信息保存成功',1,()=>{
                        history.replace('/home')
                    })
                }else{
                    Toast.fail(msg,1)
                }
            })
        }
    }

    render() {
        let {nickname, company, bossJob, rongzi, guimo, companyAddr, avatar} = this.state;
        return (
            <div>
                <div style={{height:'calc(100vh - 92px)',overflow:'auto',paddingBottom:'15px',background:'#fff'}}>
                    <List>
                        <Avatarlist avatar={avatar} setAvatar={(data)=>this.handleChange('avatar',data)}></Avatarlist>
                        <InputItem
                            placeholder="老板名称，如邵先生"
                            value={nickname}
                            onChange={(val)=>this.handleChange('nickname',val)}
                        >
                            老板名称
                        </InputItem>
                        <InputItem
                            placeholder="公司，如xxx有限公司"
                            value={company}
                            onChange={(val)=>this.handleChange('company',val)}
                        >
                            公司名称
                        </InputItem>
                        <InputItem
                            placeholder="职位，如技术总监"
                            value={bossJob}
                            onChange={(val)=>this.handleChange('job',val)}
                        >
                            公司职位
                        </InputItem>
                        <Picker
                            data={rongziZone}
                            title="公司融资"
                            cols={1}
                            value={rongzi}
                            onOk={e => this.handleChange('rongzi',e)}
                        >
                            <List.Item arrow="horizontal">公司融资</List.Item>
                        </Picker>
                        <Picker
                            data={guimoZone}
                            title="公司规模"
                            cols={1}
                            value={guimo}
                            onOk={e => this.handleChange('guimo',e)}
                        >
                            <List.Item arrow="horizontal">公司规模</List.Item>
                        </Picker>
                        <Picker
                                data={province}
                                title="公司地址"
                                value={companyAddr}
                                onOk={e => this.handleChange('addr',e)}
                        >

                            <List.Item arrow="horizontal">公司地址</List.Item>
                        </Picker>
                    </List>
                </div>
                <Button type="primary" onClick={this.handleSave}>保存</Button>
            </div>
        )
    }
}

export default connect(
    (state)=>({
        user:state.user
    }),
    {
        updateInfo:updateInfoAsync
    }
)(Bossinfo)